<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{ data.title }}</title>
    <link rel="stylesheet" href="/static/styles.css">
</head>
<body>
    <div class="book-detail">
        <h1>{{ data.title }}</h1>
        <a href="{{ data.pdf }}" download="">Get this book's PDF file for free.</a>
        <h2>Author: {{ data.author }}</h2>
        <h2>Language: {{ data.lang }}</h2>
        <h2>Genres: {{ data.Genres }}</h2>
        <section id="synopsis">
            <h3>Synopsis</h3>
            {% for syno in data.Synopsis %}
                <p>
                    {{ syno }}
                </p>
            {% endfor %}
        </section>
        <section id="reviews">
            <h3>Reviews</h3>
            <ul>
                {% for rev in data.Reviews %}
                <li>
                    {{ rev }}
                </li>
                {% endfor %}
            </ul>
        </section>
        <section id="tags">
            <h3>Tags</h3>
            <ul>
                {% for tag in data.Tags %}
                    <li>{{ tag }}</li>
                {% endfor %}
            </ul>
        </section>
        <section id="related-books">
            <h3>Related Books</h3>
            <ul>
                {% for book in data['Related Books'] %}
                    <li>{{ book }}</li>
                {% endfor %}
            </ul>
        </section>
    </div>
</body>
</html>

